<template>
  <div class="page-table">
    <div class="page-filter">
      <div class="query">
        <el-form size="mini">
          <ad-month-select v-model="searchQuery.month" @select="orderGetInitList()" />
        </el-form>
      </div>
      <div class="op">
        <el-button size="mini" type="primary" plain :loading="bonusDownloading" @click="exportBonusExcel"
          >导出网点奖励明细</el-button
        >
        <el-button size="mini" type="primary" plain :loadin="percentDownloading" @click="exportPercentExcel"
          >导出提成明细</el-button
        >
        <el-button size="mini" type="primary" plain class="op-btn" @click="commission()">提成</el-button>
        <el-button
          size="mini"
          type="primary"
          plain
          v-permission="['admin', 'site:add']"
          @click="
            () => {
              $refs.addnetWork.commissionVisible = true
              $refs.addnetWork.$refs.addformRef.resetFields()
            }
          "
          >新增</el-button
        >
        <el-button size="mini" type="primary" plain @click="signaturManagement = true">签章管理</el-button>
      </div>
    </div>
    <ad-table
      ref="order"
      :data="orderList"
      :show-summary="orderSummary"
      v-loading="orderInitLoading"
      border
      u-table
      :data-changes-scroll-top="orderIsScrollTop"
      @row-click="orderSelectRow"
      @selection-change="orderSelectRows"
      :searchQuery="orderSearchQuery"
      @search="orderGetInitList"
      @sort-change="orderSortInitList"
      @filter-change="orderFilterInitList"
      :height="tableHeight"
    >
      <ad-table-column label="序号" type="index" ctype="index" fixed />
      <ad-table-column label="网点名称" prop="name" w="4c1f" />
      <!--      <ad-table-column label="联系人" prop="linkman" w="4c1f"/>-->
      <!--      <ad-table-column label="联系电话" prop="phone" w="4c1f"/>-->
      <ad-table-column label="地址" prop="address" ctype="address" />
      <ad-table-column label="城市" prop="regionCode" ctype="city" searchable />
      <ad-table-column label="制单工资" sortable w="4c1f">
        <template v-slot="{ row }">
          <template v-if="row.createCount > 0">
            <value :model="row" prop="createFee" />元(<value :model="row" prop="createCount" />台)
          </template>
          <template v-else>-</template>
        </template>
      </ad-table-column>
      <ad-table-column label="提短工资" sortable w="4c1f">
        <template v-slot="{ row }">
          <template v-if="row.pickFreeCount > 0">
            <value :model="row" prop="pickFreeFee" />元(<value :model="row" prop="pickFreeCount" />台)
          </template>
          <template v-else>-</template>
        </template>
      </ad-table-column>
      <ad-table-column label="提车指派工资" sortable w="6c1f">
        <template v-slot="{ row }">
          <template v-if="row.pickCount > 0">
            <value :model="row" prop="pickFee" />元(<value :model="row" prop="pickCount" />台)
          </template>
          <template v-else>-</template>
        </template>
      </ad-table-column>
      <ad-table-column label="验车工资" sortable w="4c1f">
        <template v-slot="{ row }">
          <template v-if="row.verifyCount > 0">
            <value :model="row" prop="verifyFee" />元(<value :model="row" prop="verifyCount" />台)
          </template>
          <template v-else>-</template>
        </template>
      </ad-table-column>
      <ad-table-column label="发运工资" sortable w="4c1f">
        <template v-slot="{ row }">
          <template v-if="row.transportCount > 0">
            <value :model="row" prop="transportFee" />元(<value :model="row" prop="transportCount" />台)
          </template>
          <template v-else>-</template>
        </template>
      </ad-table-column>
      <ad-table-column label="签收工资" sortable w="4c1f">
        <template v-slot="{ row }">
          <template v-if="row.signCount > 0">
            <value :model="row" prop="signFee" />元(<value :model="row" prop="signCount" />台)
          </template>
          <template v-else>-</template>
        </template>
      </ad-table-column>
      <ad-table-column label="交付工资" sortable w="4c1f">
        <template v-slot="{ row }">
          <template v-if="row.deliveryCount > 0">
            <value :model="row" prop="deliveryFee" />元(<value :model="row" prop="deliveryCount" />台)
          </template>
          <template v-else>-</template>
        </template>
      </ad-table-column>
      <ad-table-column label="提成工资" sortable w="4c1f">
        <template v-slot="{ row }">
          <template v-if="row.royaltyCount > 0">
            <value :model="row" prop="royaltyFee" />元(<value :model="row" prop="royaltyCount" />台)
          </template>
          <template v-else>-</template>
        </template>
      </ad-table-column>
      <ad-table-column label="线路合计(条)" prop="lineCount" sortable w="6c1f" />
      <ad-table-column label="客户供应商合计(个)" prop="companyCount" sortable w="9c1f" />
      <ad-table-column width="auto" />
      <ad-table-column label="操作" fixed="right" width="260">
        <template v-slot="{ row }">
          <div class="op">
            <el-button type="text" class="op-btn" @click="$refs.addForm.add(row.id)">添加网点人员</el-button>
            <el-button
              type="text"
              class="op-btn"
              v-permission="['admin', 'site:view']"
              @click="$router.push({ path: '/revenue', query: { id: row.id, name: row.name } })"
              >查看</el-button
            >
            <el-button type="text" class="op-btn" v-permission="['admin', 'site:edit']" @click="openOrderAdder"
              >修改</el-button
            >
            <el-button type="text" class="op-btn" v-permission="['admin', 'site:del']" @click="orderDel"
              >删除</el-button
            >
          </div>
        </template>
      </ad-table-column>
    </ad-table>

    <el-dialog title="网点信息" :visible.sync="orderAdder.visible" custom-class="ad-dialog" width="420px">
      <adder :mode="orderAdder.mode" :id="orderSelectedRowId" :visible.sync="orderAdder.visible" @saved="orderSaved" />
    </el-dialog>
    <el-dialog title="网点提成" :visible.sync="commissionVisible" custom-class="ad-dialog" width="85%">
      <div>
        <commission />
      </div>
    </el-dialog>

    <el-dialog title="签章管理" :visible.sync="signaturManagement" custom-class="ad-dialog" width="420px">
      <signatureManagement
        @signaturManagementCancel="signaturManagementCancel"
        @signaturManagementSaved="signaturManagementSaved"
      />
    </el-dialog>
    <add-form ref="addForm" @ok="handleOk" />
    <add-network ref="addnetWork" @success="handleOk" />
  </div>
</template>

<script>
import Value from '@/components/AdValue'
import AdTable from '@/components/AdTable'
import AdTableColumn from '@/components/AdTable/AdTableColumn'
import AdMonthSelect from '@/components/AdMonthSelect'
import addForm from './addForm'
import Date from '@/utils/datetime'
import adder from './add'
import signatureManagement from './signatureManagement'
import commission from '@/views/system/site/commission'
import adTable from '@/mixins/adTable/index'
import { getList as orderApiGetList, del as orderApiDel } from '@/api/site'
import { downloadFile } from '@/utils'
import { download } from '@/api/data'
import AddNetwork from '@/views/system/site/addNetwork.vue'

export default {
  name: 'system-site',
  components: {
    AddNetwork,
    Value,
    AdTable,
    AdTableColumn,
    AdMonthSelect,
    adder,
    commission,
    addForm,
    signatureManagement
  },
  dicts: ['order_status', 'payment_type'],
  mixins: [adTable('order')],
  data() {
    return {
      id: '',
      signaturManagement: false,
      commissionVisible: false,
      searchQuery: {
        month: new Date().strftime('%G%m')
      },
      bonusDownloading: false,
      percentDownloading: false,
      tableHeight: document.documentElement.clientHeight - 136
    }
  },
  created() {
    this.orderGetInitList()
  },
  methods: {
    orderApiGetList,
    orderApiDel,
    openOrderAdder() {
      setTimeout(() => this.orderEdit())
    },
    commission() {
      this.commissionVisible = true
    },
    signaturManagementCancel() {
      this.signaturManagement = false
    },
    handleOk() {
      this.orderGetInitList()
    },
    signaturManagementSaved() {
      this.signaturManagement = false
    },
    exportBonusExcel() {
      this.bonusDownloading = true
      const loading = this.$loading({
        lock: true,
        text: '正在下载，请稍等...',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      download('/api/site/export/bonus', { ...this.searchQuery })
        .then(result => {
          downloadFile(result.data, result.headers.downloadFileName, 'xlsx')
          loading.close()
        })
        .finally(() => {
          loading.close()
          this.bonusDownloading = false
        })
    },
    exportPercentExcel() {
      this.percentDownloading = true
      const loading = this.$loading({
        lock: true,
        text: '正在下载，请稍等...',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      download('/api/site/export/royalty', { ...this.searchQuery })
        .then(result => {
          downloadFile(result.data, result.headers.downloadFileName, 'xlsx')
          loading.close()
        })
        .finally(() => {
          loading.close()
          this.percentDownloading = false
        })
    }
  }
}
</script>

<style lang="scss" scoped></style>
